<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>东台市企业服务云平台——诉求管理——企业处理诉求</title>
<body>
    <div th:fragment="company_dispose" style="height:100%;">
        <style>
            
        </style>
        <!-- 面包屑 -->
        <ol class="breadcrumb">
            <li><a href="javascript:;">诉求管理</a></li>
            <li class="active">待处理诉求</li>
        </ol>

        <div class="content" style="height:100%;">
            <!--导航条-->
            <div class="navbar navbar-default">
                <div class="container-fluid nav-container">
                    <div class="collapse navbar-collapse nav-collapse">
                        <ul class="nav navbar-nav nav-ul">
                            <li>
                                <a href="#" id="upload">
                                    <i class="fa fa-upload"></i>
                                    导出
                                </a>
                            </li>
                            <li>
                                <a href="#" id="refresh">
                                    <i class="fa fa-refresh"></i>
                                    刷新
                                </a>
                            </li>
                        </ul>
                        <form class="navbar-form navbar-right" onsubmit="return false;" id="search_form">
                            <select id="appealtypeList" style="width:150px" multiple="multiple" name="" class="form-control">
                                <option value="1">项目审批</option>
                                <option value="2">安全环保</option>
                                <option value="3">“两证”办理</option>
                                <option value="4">人才用工</option>
                                <option value="5">融资担保</option>
                                <option value="6">水电煤气</option>
                                <option value="7">创新创牌</option>
                                <option value="8">财税政策</option>
                                <option value="9">社会保险</option>
                                <option value="10">法律援助</option>
                                <option value="11">其他事项</option>
                            </select>
                            <input type="hidden" name="userid" value="" id="user_id">
                            <div class="groups form-group">
                                <span class="find"><i class="fa fa-search"></i></span>
                                <input type="text" class="form-control search" id="currentusertitle" placeholder="请输入查询信息">
                            </div>
                            <input type="button" value="查询" class="btn btn-primary nav-btn" id="queryButton">
                        </form>
                    </div>
                </div>
            </div>

            <!--诉求统计表格-->
            <div class="table table-striped table-bordered table-hover" id="table">
                <!--模板-->
            </div>
                
            <!-- 分页 -->
            <div id="barcon" class="pagination pull-right barcon" >
                <!--分页模板--> 
            </div>
        </div>

        <!--查看模态框-->
        <div class="modal fade" id="company_amend" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
            <div class="modal-dialog modal-dialog-see" role="document">
                <div class="modal-content modal-content-see">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                        <h4 class="modal-title" id="myModalLabel">进度信息</h4>
                    </div>
                    <div class="modal-body modal-body-see">
                        <!--模态框内容-->
						<ul id="myTab" class="nav nav-tabs">
							<li class="active"><a href="#home" data-toggle="tab">
									流转过程 </a></li>
							<li><a href="#ios" data-toggle="tab">
								流程图</a></li>
						</ul>
						<div id="myTabContent" class="tab-content">
							<div class="tab-pane fade in active" id="home">
								<div class="panel-body" id="company_getAppeal" style="width: 100%;"></div>
							</div>
							<div class="tab-pane fade" id="ios">
								<div id="procImage" style="margin-top:20px;">
	                        		<img id="img1" alt="" src="">
	                        	</div>
							</div>
						</div>
                    </div>
                    <div class="modal-footer" style="padding-right:50px;">
                        <button type="button" class="btn btn-primary" data-dismiss="modal" id="check">查看完毕</button>
                    </div>
                </div>
            </div>
        </div>

        <!--诉求表模板-->
        <script type="text/template" id="disposeTpl">
            <!-- 表格容器，可用于设置整个的边框及高度 -->
                <div class="sti-tbl-container">
                    <!-- 表头容器，必须留出17px的滚动条位置 -->
                    <div class="sti-tbl-header" style="padding-right:17px;">
                        <table class="table table-bordered" style="margin-bottom: 0px;border-bottom-style: none;">
                            <tr>
                                <th style="width : 50%;">诉求标题</th>
                                <th style="width : 20%;">诉求类别</th>
                                <th style="width : 20%;">诉求状态</th>
                                <th style="width : 10%;">操作</th>
                            </tr>
                        </table>
                    </div>
                    <!-- 表格内容容器-->
                    <div class="sti-tbl-body">
                        <table class="table table-striped table-bordered table-hover">
                            <tbody id="adminTbody">
                                {{each list}}
                                <tr>
                                    <td style="width : 50%;">{{$value.appealtitle}}</td>
                                    {{if $value.appealtype == 1}}
                                    <td style="width: 20%;">项目审批</td>
                                    {{else if $value.appealtype == 2}}
                                    <td style="width: 20%;">安全环保</td>
                                    {{else if $value.appealtype == 3}}
                                    <td style="width: 20%;">“两证”办理</td>
                                    {{else if $value.appealtype == 4}}
                                    <td style="width: 20%;">人才用工</td>
                                    {{else if $value.appealtype == 5}}
                                    <td style="width: 20%;">融资担保</td>
                                    {{else if $value.appealtype == 6}}
                                    <td style="width: 20%;">水电煤气</td>
                                    {{else if $value.appealtype == 7}}
                                    <td style="width: 20%;">创新创牌</td>
                                    {{else if $value.appealtype == 8}}
                                    <td style="width: 20%;">财税政策</td>
                                    {{else if $value.appealtype == 9}}
                                    <td style="width: 20%;">社会保险</td>
                                    {{else if $value.appealtype == 10}}
                                    <td style="width: 20%;">法律援助</td>
                                    {{else if $value.appealtype == 11}}
                                    <td style="width: 20%;">其他事项</td>
                                    {{else}}
                                    <td style="width: 20%;"></td>
                                    {{/if}}
                                    {{if $value.taskstatus == 1}}
                                    <td style="width: 20%;">未提交</td>
                                    {{else if $value.taskstatus == 2}}
                                    <td style="width: 20%;">未受理</td>
                                    {{else if $value.taskstatus == 3}}
                                    <td style="width: 20%;">处理中</td>
                                    {{else if $value.taskstatus == 4}}
                                    <td style="width: 20%;">结束</td>
                                    {{/if}}
                                    <td style="width : 10%;" data-id={{$value.appealid}} data-taskid={{$value.taskList[$value.taskList.length-1].taskid}} data-procInstId={{$value.procInstId}}>
                                        <a href="#company_amend" data-toggle="modal" class="btn btn-primary btn-xs getAppeal">查看</a>
                                    </td>
                                </tr>
                                {{/each}}
                            </tbody>
                        </table>
                    </div>
                </div>
        </script>

        <!--分页模板-->
        <script type="text/template" id="page">
            <div id="barcon1" class="barcon1"></div>  
            <div id="barcon2" class="barcon2">  
                <ul>  
                    <li><a href="###" id="firstPage" class="{{model.pageNum == 1?'disabled':''}}" data-pageNum="1">首页</a></li>  
                    <li><a href="###" id="prePage" class="{{model.pageNum > 1?'':'disabled'}}" data-pageNum="{{model.pageNum - 1}}">上一页</a></li>  
                    <li><a href="###" id="nextPage" class="{{model.pageNum < model.pageCount?'':'disabled'}}" data-pageNum="{{model.pageNum + 1}}">下一页</a></li>  
                    <li><a href="###" id="lastPage" class="{{model.pageNum == model.pageCount?'disabled':''}}" data-pageNum="{{model.pageCount}}">尾页</a></li>  
                    <li>
                        <select class="jumpWhere" id="jumpWhere"></select>
                    </li>  
                    <li><span id="jumpPage" onclick="jumpPage()">跳转</span></li>  
                </ul>  
            </div> 
        </script>

        <!--查看模态框-->
        <script type="text/template" id="getdisposeTpl">
            <div class="demo" style="width:100%;">
                <table border="1" width="100%" cellspacing="0" cellpadding="0">
                    <tr>
                        <th width="18%">企业名称：</th>
                        <td>{{appellortitle}}</td>
                        <th>企业类型：</th>
                        {{if category == 1}}
                        <td>星级企业</td>
                        {{else if category == 2}}
                        <td>规上企业</td>
                        {{else if category == 3}}
                        <td>小微企业</td>
                        {{else}}
                        <td>--</td>
                        {{/if}}
                    </tr>
                    <tr>
                        <th width="18%">所属区镇：</th>
                        <td>{{towntitle}}</td>
                        <th>诉求类型：</th>
                        {{if appealtype == 1}}
                        <td>项目审批</td>
                        {{else if appealtype == 2}}
                        <td>安全环保</td>
                        {{else if appealtype == 3}}
                        <td>“两证”办理</td>
                        {{else if appealtype == 4}}
                        <td>人才用工</td>
                        {{else if appealtype == 5}}
                        <td>融资担保</td>
                        {{else if appealtype == 6}}
                        <td>水电煤气</td>
                        {{else if appealtype == 7}}
                        <td>创新创牌</td>
                        {{else if appealtype == 8}}
                        <td>财税政策</td>
                        {{else if appealtype == 9}}
                        <td>社会保险</td>
                        {{else if appealtype == 10}}
                        <td>法律援助</td>
                        {{else if appealtype == 11}}
                        <td>其他事项</td>
                        {{/if}}
                    </tr>
                    <tr>
                        <th width="18%">当前处理人：</th>
                        <td>{{currentusertitle}}</td>
                        <th width="18%">当前诉求状态：</th>
                        {{if taskstatus == 1}}
                        <td>未提交</td>
                        {{else if taskstatus == 2}}
                        <td>未受理</td>
                        {{else if taskstatus == 3}}
                        <td>处理中</td>
                        {{else if taskstatus == 4}}
                        <td>处理完毕</td>
                        {{else}}
                        <td>--</td>
                        {{/if}}
                    </tr>
                    <tr>
                        <th width="18%">提交时间：</th>
                        <td>{{submittime}}</td>
                        <th width="18%">完结时间：</th>
                        {{if endtime}}
                        <td width="18%">{{endtime}}</td>
                        {{else}}
                        <td width="18%"></td>
                        {{/if}}
                    </tr>
                    <tr>
                        <th>诉求标题：</th>
                        <td colspan="3">{{appealtitle}}</td>
                    </tr>
                    <tr>
                        <th>诉求内容：</th>
                        <td colspan="3">{{appealcontent}}</td>
                    </tr>
                    {{if imagepaths != ''}}
                    <tr>
                        <th>诉求附件：</th>
                        <td colspan="3">
                            {{each imagepaths.split(",")}}
                            <a href="{{$value}}" style="margin:3px 0;display:block;">
                                <font color="blue" size="2">{{$value.split("/")[$value.split("/").length-1]}}</font>
                            </a>
                            {{/each}}
                        </td>
                    </tr>
                    {{/if}}
                    <tr>
                        <th colspan="4" style="text-align: center;">诉求流转信息</th>
                    </tr>
                    {{each taskList}}
                        {{if $value.progressinfoList.length != 0 && $index > 0}}
                            <tr>
                                {{if $value.replycontent}}
                                    <th rowspan="3">{{$value.handletitle}}&nbsp;处理意见：</th>
                                {{else}}
                                    <th rowspan="2">{{$value.handletitle}}&nbsp;处理意见：</th>
                                {{/if}}
                                <td colspan="3" style="text-align:center;">处理内容</td>
                            </tr>
                            <tr>
                                <td colspan="3">
                                    {{each $value.progressinfoList}}
                                        <div style="margin:10px 0;">{{$value.replycontent}}&nbsp;<span style="float:right;margin-right:10px;">({{$value.replytime}})</span></div>
                                    {{/each}}
                                </td>
                            </tr>
                            {{if $value.replycontent}}
                                <tr>
                                    <td colspan="3">{{$value.replycontent}}&nbsp;<span style="float:right;margin-right:10px;">({{$value.endtime}})</span></td> 
                                </tr>
                            {{/if}}
                        {{else if $value.progressinfoList.length == 0 && $index > 0}}
                            {{if $value.replycontent}}
                                <tr>
                                    <th>{{$value.handletitle}}&nbsp;处理意见：</th>
                                    <td colspan="3">{{$value.replycontent}}&nbsp;<span style="float:right;margin-right:10px;">({{$value.endtime}})</span></td> 
                                </tr>
                            {{/if}}
                        {{/if}}
                    {{/each}}
                </table>
                <input type="hidden" id='taskid' name="taskid" value={{taskList[taskList.length-1].taskid}}>
            </div>
        </script>

        <script>
            var $refresh = $('#refresh');
            var $pageBox = $('.pagination');
            var handleid = userid;
            var appealList = $('#table');

            // 按条件查找下拉框初始化
            $(document).ready(function() {
                $('#appealtypeList').multiselect({
                    buttonText: function(options, select) {
                        if (options.length === 0) {
                            return '-- 事项划分--';
                        }
                        else if (options.length > 0) {
                            return '已选查询条件';
                        }
                    }
                });
            });
            
            // 获取所有诉求
            var paging = function (pageNum,tj) {
                $.ajax({
                    url: appBaseURL + '/appeal/todoTaskByHandleid/',
                    type: 'POST',
                    data: JSON.stringify(tj) || JSON.stringify({"userid":userid,"taskstatusList":[3],"pageNum":pageNum || 1,"pageSize":20}),
                    contentType: "application/json",
                    success: function (info) {
                        if(info.code == 0){
                            // 调用模板引擎
                            appealList.html(template('disposeTpl', {list: info.data.list}));
                            // 分页按钮
                            $pageBox.html(template('page', {
                                model: {
                                    'pageNum':info.data.pageNum,
                                    'pageCount': info.data.pages
                                }
                            }));
                            var tempStr = "共"+info.data.total+"条 第"+(pageNum || 1)+"/"+info.data.pages+"页";  
                            document.getElementById("barcon1").innerHTML = tempStr; 
                            var tempOption="";
                            var currentPage = pageNum || 1;//当前页数 
                                currentPage_ = currentPage;
                            for(var i = 1; i <= info.data.pages; i++) {  
                                tempOption+='<option value='+i+'>'+i+'</option>'  
                            }  
                            $("#jumpWhere").html(tempOption);
                            $("#jumpWhere").val(currentPage || 1);
                            window.pageNow = info.data.pageNum;
                        }else{
                            toastr.error("请求失败，请稍后再试！");
                        }
                    },
                    error: function () {
                        toastr.error("请求失败，请稍后再试！");
                    } 
                });
            }
            // 页面初始化
            paging();
            // 换页
            $pageBox.on('click', 'a', function () {
                if($(this).hasClass('disabled')||$('.overlay:visible').length) return false;
                paging($(this).attr('data-pageNum')*1);
            });
            // 跳转
            function jumpPage() {  
                var num = parseInt($("#jumpWhere").val()); 
                if(num != currentPage_)  
                {  
                    paging(num); 
                }  
            }

            // 查看诉求信息
            function ckeck(appealid,procInstId,Tpl,$place){
                $.ajax({
                    url: appBaseURL + "/appeal/queryAppealByAppealId/" + appealid,
                    type: 'POST',
                    data: JSON.stringify({"userid":userid}),
                    contentType: "application/json",
                    success: function (info) {
                        if(info.code == 0){
                            appealData = info.data;
                            // 调用模板引擎
                            $place.html(template(Tpl, appealData));
                            // 获取当前职能部门的诉求id
                            var tasks = info.data.taskList;
                            for(var i = 0,len = tasks.length; i < len; i++){
                                if(tasks[i].handleid == userid){
                                    task = tasks[i];
                                }
                            }
                            $('#taskid').val(task.taskid);
                        }else{
                            toastr.error(info.message,"请求失败，请稍后再试！");
                        }
                    },
                    error: function () {
                        toastr.error("请求失败，请稍后再试！");
                    } 
                });
                
                //获取流程图
                $.ajax({
                    url: appBaseURL + "/processImage/generateImage/" + procInstId,
                    type: 'POST',
                    contentType: "application/json",
                    success: function(info) {
                        if (info.code == 0) {
                            console.log(info.data);
                            $("#img1").attr('src', info.data);
                        } else {
                            toastr.error("请求失败，请稍后再试！");
                        }
                    },
                    error: function() {
                        toastr.error("请求失败，请稍后再试！");
                    }
                });
            }
            appealList.on('click','.getAppeal',function(){;
                var appealid = $(this).parent().attr('data-id');
                var procInstId = $(this).parent().attr('data-procInstId');
                var appealData = {};
                ckeck(appealid,procInstId,'getdisposeTpl',$('#company_getAppeal'));
            });

            // 按选中条件查询诉求信息
            $('#queryButton').click(function() {
                var tj = {};
                    tj.userid = userid;
                    tj.taskstatusList = toNumber($('#taskstatusList').val());
                    tj.currentusertitle = $('#currentusertitle').val();
                    tj.categoryList = toNumber($('#categoryList').val());
                    tj.appealtypeList = toNumber($('#appealtypeList').val());
                    tj.pageNum = 1;
                    tj.pageSize = 20;
                paging(1,tj);
            });
            $('#currentusertitle').on('keypress',function(event){  
                var theEvent = window.event || event;
                var code = theEvent.keyCode || theEvent.which;
                if(code == 13) {
                    var tj = {};
                        tj.userid = userid;
                        tj.taskstatusList = toNumber($('#taskstatusList').val());
                        tj.currentusertitle = $('#currentusertitle').val();
                        tj.categoryList = toNumber($('#categoryList').val());
                        tj.appealtypeList = toNumber($('#appealtypeList').val());
                        tj.pageNum = 1;
                        tj.pageSize = 20;
                    paging(1,tj);
                }
            });

            // 企业结束查看任务
            $('#check').on('click',function(){
                var taskid = $('#taskid').val();
                $.ajax({
                    url: appBaseURL + '/appeal/enterpriseEndTaskAndAppeal/' + taskid,
                    type: 'POST',
                    contentType: "application/json",
                    success: function (info) {
                        if(info.code == 0){
                            toastr.success('处理成功！');
                            paging(window.pageNow || 1);
                        }else{
                            toastr.error("处理失败，请稍后再试！");
                        }
                    },
                    error: function () {
                        toastr.error("请求失败，请稍后再试！");
                    } 
                });
            });
            
            // 刷新
            $refresh.click(function () {
                paging(window.pageNow || 1);
                $('#search_form')[0].reset();
                $('#appealtypeList').multiselect('refresh');
            });
        </script>
    </div>
</body>
</html>